// 颜色主题-版块
$('.big-colorful-box').css({
    width:$(".colorful-box").length / 2 * $(".colorful-box").width()+80
})
console.log($(".colorful-box").length);
console.log($(".colorful-box").length*$(".colorful-box").width()+60);
// var index = 0
var flag = true
// 右键点击事件
$(".colorful-right").click(function(){
    if(!flag) return false;
    flag = false
    $('.big-colorful-box').animate({
        left:-$(".colorful-box").width() - 25
    },500,"linear")
    var diff = ($(".colorful-box").width() + 25)/$('.big-colorful-box').outerWidth()
    console.log(diff);
    // $(".colorful-drag").animate({
    //     left:"313.74px"
    // },800,"linear")
    flag = true
})
// 左键点击事件
$(".colorful-left").click(function(){
    if(!flag) return false;
    flag = false
    $('.big-colorful-box').animate({
        left:"0"
    },600,"linear")
    flag = true
})































//图片主题-版块
$('.big-images-box').css({
    width:$(".images-box").length*$(".images-box").width()+($(".images-box").length-1)*60
})

// 轮播图
var index = 1;
var flag = true;
// 处理ol小圆点
$(".tab").find("ul").children().each(function(i,v){
    $(".tab ol").append("<li></li>")
    if(i === 0){
        $("ol li").eq(i).prop("class","active")
    }
})
// 处理图片
var last = $(".tab ul").children().last().clone()
var first = $(".tab ul").children().first().clone()
$(".tab ul").prepend(last).append(first).css({
    width:$(".tab ul li").length * $(".tab ul li").outerWidth() + "px",
    left:-index * $(".tab ul img").outerWidth() + "px"
})
console.log($(".tab ul").outerWidth());
// 右键点击事件
$(".tab-right").click(function(){
    if(!flag) return false;
    flag = false
    index++;
    $(".tab ul").animate({
        left:-index * $(".tab ul img").outerWidth() + "px",
    },1500,"linear",function(){
        if(index === $(".tab ul li").length-1){
            index = 1;
            $(".tab ul").css({
                left:-index * $(".tab ul img").outerWidth() + "px",
            })
        }
        $(".tab ol li").eq(index-1).prop("class","active").siblings().prop("class","")
        flag = true
    })
})
//左键点击事件
$(".tab-left").click(function(){
    if(!flag) return false;
    flag = false
    index--;
    $(".tab ul").animate({
        left:-index * $(".tab ul img").outerWidth() + "px",
    },1500,"linear",function(){
        if(index === 0){
            index = $(".tab ul li").length-2;
            $(".tab ul").css({
                left:-index * $(".tab ul img").outerWidth() + "px",
            })
        }
        $(".tab ol li").eq(index-1).prop("class","active").siblings().prop("class","")
        flag = true
    })
})
// 小圆点点击事件
$(".tab ol li").click(function(){
    if(!flag) return false;
    flag = false
    index = $(this).index() + 1
    $(".tab ul").animate({
        left:-index * $(".tab ul img").outerWidth() + "px",
    },1500,"linear")
    $(".tab ol li").eq(index-1).prop("class","active").siblings().prop("class","")
    flag = true
})
// 自动轮播
var timer = setInterval(() => {
    if(!flag) return false;
    flag = false
    index++;
    $(".tab ul").animate({
        left:-index * $(".tab ul img").outerWidth() + "px",
    },1000,"linear",function(){
        if(index === $(".tab ul li").length-1){
            index = 1;
            $(".tab ul").css({
                left:-index * $(".tab ul img").outerWidth() + "px",
            })
        }
        $(".tab ol li").eq(index-1).prop("class","active").siblings().prop("class","")
        flag = true
    })
},4000);
// 鼠标移入停止自动轮播
$(".tab").mouseover(function(){
    clearInterval(timer)
})
// 鼠标移出继续轮播
$(".tab").mouseout(function(){
    timer = setInterval(() => {
        if(!flag) return false;
        flag = false
        index++;
        $(".tab ul").animate({
            left:-index * $(".tab ul img").outerWidth() + "px",
        },1000,"linear",function(){
            if(index === $(".tab ul li").length-1){
                index = 1;
                $(".tab ul").css({
                    left:-index * $(".tab ul img").outerWidth() + "px",
                })
            }
            $(".tab ol li").eq(index-1).prop("class","active").siblings().prop("class","")
            flag = true
        })
    },4000);
})




// 鼠标移入事件************************************************************
// app下载
$(".download-app").on("mouseover",function(){
    $(".download-app-hide").stop().slideDown()
})
$(".download-app").on("mouseout",function(){
    $(".download-app-hide").stop().slideUp()
})

// tab图箭头
function aShow(ele) {
    $(`.${ele}`).mouseover(function(){
        $(this).find(".a").css("opacity","1")
    })
    $(`.${ele}`).mouseout(function(){
        $(this).find(".a").css("opacity","0")
    })
}
aShow("tab")
aShow("swiper")
aShow("infinity")

// 家居好物  8月好物
function imgShow(ele) {
    $(`.${ele}`).mouseover(function(){
        $(this).find(`.${ele}-hide`).css("opacity","1")
    })
    $(`.${ele}`).mouseout(function(){
        $(this).find(`.${ele}-hide`).css("opacity","0")
    })
}
imgShow("goods-imgs")
imgShow("august-imgs")

function addShow(ele) {
    $(`.${ele}-box`).mouseover(function(){
        $(this).find(`.${ele}-add`).css("opacity","1")
    })
    $(`.${ele}-box`).mouseout(function(){
        $(this).find(`.${ele}-add`).css("opacity","0")
    })
}
addShow("goods")
addShow("august")
